<template>
    <view class="u-page">
        <view class="u-demo-block">
            <view class="u-demo-block__content">
                <u-row customStyle="margin-bottom: 10px">
                    <u-col span="12">
                        <view class="demo-layout bg-purple-light h">收货地址</view>
                    </u-col>
                </u-row>

                <u-row customStyle="margin-bottom: 10px">
                    <u-col span="2">
                        <view class="demo-layout bg-purple">{{ address.consignee }}</view>
                    </u-col>
                    <u-col span="4">
                        <view class="demo-layout bg-purple">{{ address.mobile }}</view>
                    </u-col>
                </u-row>

                <u-row customStyle="margin-bottom: 10px">
                    <u-col span="12">
                        <view class="demo-layout bg-purple" style="text-align: left;">{{ address.region_text }}-{{ address.address }}</view>
                    </u-col>
                </u-row>

                <u-row customStyle="margin-bottom: 10px">
                    <u-col span="12">
                        <view class="demo-layout bg-purple h">商品信息</view>
                    </u-col>
                </u-row>

                <u-row customStyle="margin-bottom: 10px">
                    <u-col span="3">
                        <view class="demo-layout bg-purple">商品名称</view>
                    </u-col>
                    <u-col span="3">
                        <view class="demo-layout bg-purple">商品数量</view>
                    </u-col>
                    <u-col span="3">
                        <view class="demo-layout bg-purple">商品单价</view>
                    </u-col>
                    <u-col span="3">
                        <view class="demo-layout bg-purple">总价</view>
                    </u-col>
                </u-row>

                <view v-for="item in product" :key="item.id">
                    <u-row customStyle="margin-bottom: 10px">
                        <u-col span="3">
                            <view class="demo-layout bg-purple">{{ item.products.name }}</view>
                        </u-col>
                        <u-col span="3">
                            <view class="demo-layout bg-purple">{{ item.pronum }}</view>
                        </u-col>
                        <u-col span="3">
                            <view class="demo-layout bg-purple">{{ item.price }}</view>
                        </u-col>
                        <u-col span="3">
                            <view class="demo-layout bg-purple">{{ item.total }}</view>
                        </u-col>
                    </u-row>
                </view>

                <u-row customStyle="margin-bottom: 10px">
                    <u-col span="12">
                        <view class="demo-layout bg-purple h">订单信息</view>
                    </u-col>
                </u-row>

                <u-row customStyle="margin-bottom: 10px">
                    <u-col span="3">
                        <view class="demo-layout bg-purple">订单号</view>
                        </u-col>
                    <u-col span="9">
                        <view class="demo-layout bg-purple">{{ list.code }}</view>
                    </u-col>
                </u-row>

                <u-row customStyle="margin-bottom: 10px">
                    <u-col span="3">
                        <view class="demo-layout bg-purple">订单状态</view>
                    </u-col>
                    <u-col span="3">
                        <view class="demo-layout bg-purple">{{ list.status_text }}</view>
                    </u-col>
                </u-row>

                <u-row customStyle="margin-bottom: 10px">
                    <u-col span="3">
                        <view class="demo-layout bg-purple">订单总价</view>
                    </u-col>
                    <u-col span="3">
                        <view class="demo-layout bg-purple">{{ list.amount }}</view>
                    </u-col>
                </u-row>


            </view>
        </view>

        <u-toast ref="uToast"></u-toast>
    </view>
</template>

<script>
export default {
    data() {
        return {
            LoginAdmin: {},
            list: [],
            // 地址信息
            address: [],
            business: [],
            product: [],

            id: 0,
        };
    },
    methods: {
        async getList() {
            let data = {
                id: this.id,
                adminid: this.LoginAdmin.id
            }
            let result = await this.$u.api.manage.productinfo(data);

            if (result.code == 1 && result) {
                this.list = result.data.order;
                this.address = result.data.order.address;
                this.business = result.data.order.business;
                this.product = result.data.ProductList
            } else {
                this.$refs.uToast.show({
                    type: "error",
                    message: result.msg,
                });
            }

        }
    },
    onLoad(options) {
        this.id = options.id;
        this.LoginAdmin = uni.getStorageSync("admin");
        this.getList();
    }
}
</script>

<style lang="scss">
.wrap {
    padding: 12px;
}

.demo-layout {
    height: 25px;
    border-radius: 4px;
    text-align: center;
}

.bg-purple {
    background: #ffffff;
    overflow: hidden;
}

.bg-purple-light {
    background: #e5e9f2;
}

.bg-purple-dark {
    background: #99a9bf;
}
.h{
    background: linear-gradient(to right, rgb(243, 150, 150),  rgb(170, 170, 249));
}
</style>
